<%@ page import="com.qipay.baas.model.ActionDocDetail" %>
<%@ page import="com.qipay.doc.vo.ActionDocDTO" %>
<%@ page import="java.util.List" %>
<%@ page import="org.apache.commons.lang3.StringUtils" %>
<%@ page import="org.apache.commons.lang3.StringEscapeUtils" %>
<%--
  Created by IntelliJ IDEA.
  User: dong
  Date: 2017/9/21
  Time: 15:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <jsp:include page="head.jsp"></jsp:include>
</head>
<body>
<div class="wrapper">
    <jsp:include page="nav.jsp"></jsp:include>
    <div class="catelog center">

        <div class="cat_list">
            <ul>
                <%
                    String webHost = (String) request.getAttribute("webHost");
                    List<ActionDocDTO> actionDocDTOS = (List<ActionDocDTO>) request.getAttribute("lst");
                    ActionDocDetail detailCurrent = (ActionDocDetail) request.getAttribute("detail");
                    if (actionDocDTOS != null && actionDocDTOS.size() > 0) {
                        for (ActionDocDTO dto : actionDocDTOS) {
                %>
                <li class="item" id="parent<%= dto.getId()%>">
                    <a href="javascript:;" class="item_name <%= dto.getId()==detailCurrent.getPid()?"on1":""%>" id="<%= dto.getId()%>">
                        <%= dto.getTitle()%>
                    </a>
                    <% List<ActionDocDetail> details = dto.getChild();
                        if (details != null && details.size() > 0) {%>
                    <ul class="sub_item" style="<%= dto.getId()==detailCurrent.getPid()?"display:block":"display:none"%>">
                        <%
                            for (ActionDocDetail detail : details) {
                        %>
                        <li>
                            <a href="${pageContext.request.contextPath}/doc/<%=detail.getDocId()%>?did=<%= detail.getId()%>"
                               id="<%= detail.getId()%>" class="<%= detail.getId()==detailCurrent.getId()?"on2":""%>">
                                <%= detail.getTitle()%>
                            </a></li>
                        <% }%>
                    </ul>
                    <% }
                    %>

                </li>
                <%
                        }
                    }
                %>


            </ul>
        </div>
        <div class="cat_detail">
            <div class="title"><%= detailCurrent.getTitle()%>
            </div>
            <div class="detail" id="dvContent">
                正在加载中...
            </div>
            <div id="dvHide" style="display: none"><%= StringEscapeUtils.escapeHtml4(detailCurrent.getInfo().replaceAll("9tfy",webHost).replaceAll("http","https"))%></div>
        </div>
    </div>
    <div class="footer_fixed"></div>
</div>
<jsp:include page="foot.jsp"></jsp:include>
<%--<script src="<%= request.getAttribute("StaticHost") %>/js/markdown.js"></script>--%>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.7.6/showdown.min.js"></script>
<script type="application/javascript">
    showdown.setOption('tables', true);
    showdown.setOption('tablesHeaderId', true);
    //showdown.setOption('ghCodeBlocks', true);
    showdown.setOption('backslashEscapesHTMLTags',true);
    setTimeout(function () {
        var htmlOld = $("#dvHide").html();
        htmlOld = HTMLDecode(htmlOld);
        var converter = new showdown.Converter();
        var html = converter.makeHtml(htmlOld);
        $("#dvContent").html(html);
        equalH();
        //延时加载底部
        setTimeout(showfooter, 50);
    },100);

    var iniRh = $(".cat_detail").height();

    $(".item_name").click(function(){
        if($(this).hasClass("on1")){
            $(this).removeClass("on1").next().slideUp(200);
        }else{
            $(".cat_list .on1").removeClass("on1").next().slideUp(200);
            $(this).addClass("on1").next().slideDown(200);
            $('#cata_id').val($(this).attr("id"))
        }
        setTimeout(function(){ //等动画完成后再计算
            var catH;
            var catulH = $(".cat_list ul").height();
            if(catulH > iniRh){
                catH = catulH;
                $(".cat_list").height(catH);
                equalH();
            }else{
                $(".cat_list,.cat_detail").height(671);
            }
        }, 200);
    });

    $(".sub_item a").click(function(){
        $(this).addClass("on2").siblings().removeClass("on2");
        var txt = $(this).text();
        $(".cat_detail .title").text(txt);

        var sub_id = $(this).attr("id");
        var sub_name = $(this).text();
        var typeCodeId = $('#typeCodeId').val();
        var cata_id = $('#cata_id').val();
        var themeConfigId = $('#themeConfigId').val();
        var url = 'index_1='+typeCodeId+'&index_2='+themeConfigId+'&chapter_1='+cata_id+'&chapter_2='+sub_id;
        //window.location.href='/openapi/doc?'+ url;
    });


    //实现左侧导航和右侧内容等高
    function equalH(){
        var lh = $(".cat_list").height();
        var rh = $(".cat_detail").height();
        if(lh >= rh){
            $(".cat_detail").height(lh);
        }else{
            $(".cat_list").height(rh);
        }
    }

    function showfooter(){
        document.getElementById("footer").style.display="";
    }

    function HTMLDecode(text)
    {
        var temp = document.createElement("div");
        temp.innerHTML = text;
        var output = temp.innerText || temp.textContent;
        temp = null;
        return output;
    }

</script>
</body>
</html>
